<template>
	<view class="page-wrap" :data-theme="theme" :style="globalColor.style">
		<header-custom title="招生专业" />
		<view>
			<view class="container">
				<view class="academyinfo">
					<view class="top fboxRow Xbetween" @tap="gotoSchool">
						<view class="left fboxRow Ycenter font30">
							<view class="color-323233">{{schoolInfo.schoolName}}</view>
							<image class="icon" v-if="schoolInfo.range == 1" src="@/static/img/bks/chong.jpg"></image>
							<image class="icon" v-else-if="schoolInfo.range == 2" src="@/static/img/bks/wen.jpg">
							</image>
							<image class="icon" v-else src="@/static/img/bks/bao.jpg"></image>
						</view>
						<view class="right font26 color-00C15D">
							院校主页
						</view>
					</view>
					<view class="middle fboxRow">
						<image class="logo" :src="schoolInfo.logo"></image>
						<view class="fboxCol Xaround flex1">
							<view class="color-646466 font26">
								录取概率：{{schoolInfo.admitRate}}，院校代码：{{schoolInfo.codeEnroll}}</view>
							<view class="tags fboxWrap">
								<block v-for="(item, index) in schoolInfo.tags" :key="index">
									<view class="item font22">{{item}}</view>
								</block>
							</view>
						</view>
					</view>
					<view class="bottom fboxRow Xaround">
						<view class="item font22">
							<view class="color-9899A1">{{schoolInfo.year - 1}}最低分</view>
							<view class="color-36363A mt8">{{schoolInfo.min != null ? schoolInfo.min + '分' : '-'}}</view>
						</view>
						<view class="item font22">
							<view class="color-9899A1">{{schoolInfo.year - 1}}最低位次</view>
							<view class="color-36363A mt8">
								{{schoolInfo.minSection != null ? schoolInfo.minSection + '名' : '-'}}
							</view>
						</view>
						<view class="item font22">
							<view class="color-9899A1">{{schoolInfo.year - 1}}录取</view>
							<view class="color-36363A mt8">
								{{schoolInfo.recruitNum != null ? schoolInfo.recruitNum + '人' : '-'}}
							</view>
						</view>
						<view class="item font22" v-if="isPlan">
							<view class="color-9899A1">{{schoolInfo.year}}计划</view>
							<view class="color-36363A mt8">
								{{schoolInfo.recruitNumPlan != null ? schoolInfo.recruitNumPlan + '人' : '-'}}
							</view>
						</view>
					</view>
				</view>
				<view class="list">
					<block v-for="(item, index) in majorList.list" :key="index">
						<view class="item">
							<view class="space-block"></view>
							<view class="content-box">
								<view class="top fboxRow Xbetween Ycenter">
									<view class="left">
										<view class="color-36363A font28" style="margin-bottom: 19rpx">
											{{item.majorName}}
										</view>
										<view class="color-646466 font26">录取概率：{{item.admitRate}}
											<!-- ，专业代码：{{item.majorCategoryId}} -->
										</view>
									</view>
									<view class="right" v-if="schoolScore == 0">
										<view v-if="!item.isVolunteer" class="btn uncheckbtn fboxRow Xcenter Ycenter"
											@tap="onVolunteer(item, index, true)">
											<text>+</text>
											<text style="margin-left: 4rpx">志愿</text>
										</view>
										<view v-else class="btn color-9899A1" @tap="onVolunteer(item, index, false)">
											<text>-</text>
											<text style="margin-left: 4rpx">志愿</text>
										</view>
									</view>
								</view>
								<view class="bottom fboxRow Xaround">
									<view class="item font22">
										<view class="color-9899A1">{{item.year - 1}}最低分</view>
										<view class="color-36363A mt8">{{item.min != null ? item.min + '分' : '-'}}</view>
									</view>
									<view class="item font22">
										<view class="color-9899A1">{{item.year - 1}}最低位次</view>
										<view class="color-36363A mt8">
											{{item.minSection != null ? item.minSection + '名' : '-'}}
										</view>
									</view>
									<view class="item font22">
										<view class="color-9899A1">{{item.year - 1}}录取</view>
										<view class="color-36363A mt8">
											{{item.recruitNum != null ? item.recruitNum + '人' : '-'}}
										</view>
									</view>
									<view class="item font22" v-if="isPlan">
										<view class="color-9899A1">{{item.year}}计划</view>
										<view class="color-36363A mt8">
											{{item.recruitNumPlan != null ? item.recruitNumPlan + '人' : '-'}}
										</view>
									</view>
								</view>
							</view>
						</view>
					</block>
					<u-loadmore style="padding-bottom: 40rpx;" :status="majorList.loading"></u-loadmore>
				</view>
				<view class="btn-group">
					<view class="btn" @tap="showTips">
						<text class="bksCIcon bks-c-ziyuan158tanhao color-fff font42"></text>
					</view>
					<view class="btn" @tap="goto" v-if="schoolScore == 0">
						<text class="bksCIcon bks-c-ziyuan160wodezhiyuan color-fff font42"></text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import headerCustom from '@/pagesBKS/components/header-custom.vue';
	import {
		forecastMajor,
		forecastMajorScore,
		volunteerAdd,
		volunteerDel
	} from '@/api/bks.volunteer.js'
	import {
		commentState
	} from '@/api/bks.consult.js'
	import {BottomMore, ListLoad, PageScroll} from '@/pagesBKS/components/minx.js'
	export default {
		components: {
			headerCustom
		},
		data() {
			return {
				theme: 'bks-theme',
				globalColor: getApp().globalData.globalColor,
				sys: {},
				schoolInfo: {},
				majorList: { // 招生专业列表
					list: [],
					page: 1,
					size: 10,
					total: 0,
					loading: 'none'
				},
				schoolScore: 0,
				batchName: '本科批',
				examAnalysisId: '',
				isPlan: false
			}
		},
		onLoad(options) {
			try{
				const schoolInfo = uni.getStorageSync('forecastSchoolInfo')
				this.schoolInfo = schoolInfo
				this.examAnalysisId = options.examAnalysisId
				if (options.schoolScore) {
					this.schoolScore = options.schoolScore
				}
				if (options.batchName) {
					this.batchName = decodeURIComponent(options.batchName)
				}
				this.getForecastMajor()
				commentState({
					type: 2
				}).then(res => {
					this.isPlan = res.data
				})
			}catch(e){
				//TODO handle the exception
			}
		},
		methods: {

			// 数据初始化
			init() {
				this.majorList = {
					list: [],
					page: 1,
					size: 10,
					total: 0,
					loading: 'none'
				}
			},
			getForecastMajor() {
				if (this.majorList.loading == 'not') {
					return
				}
				this.majorList.loading = 'loading'
				let fun = forecastMajor
				let reqData = {
					schoolId: this.schoolInfo.schoolId,
					examId: '',
					studentCode: '',
					batchName: this.batchName,
					examAnalysisId: this.examAnalysisId,
					page: this.majorList.page,
					size: this.majorList.size
				}
				// 区分是否是专家通过成绩总分查询
				if (this.schoolScore != 0) {
					fun = forecastMajorScore
					const school_score = JSON.parse(wx.getStorageSync('bks_school_score')) || {}
					reqData = {
						schoolId: this.schoolInfo.schoolId,
						score: school_score.score,
						subjectType: school_score.subjectType,
						page: this.majorList.page,
						size: this.majorList.size
					}
				}
				fun(reqData).then(res => {
					const {list, pageInfoVO: {total, page, size}} = res.data
					let resList = []
					list.forEach(item => {
						item.admitRate = Math.round(item.admitRate * 100) + '%'
						resList.push(item)
					})
					this.majorList.list = this.majorList.list.concat(resList)
					this.majorList.total = total
					const that = this
					ListLoad(page, size, total, (state) => {
						that.majorList.loading = state
					})
				})
			},
			// 下拉加载数据
			reachBottom() {
				const that = this
				BottomMore(this.majorList, (state, res) => {
					that.majorList.loading = res.loading
					that.majorList.page = res.page
					if (state) {
						that.getForecastMajor()
					}
				})
			},
			// 添加志愿
			onVolunteer(item, index, status) {
				let fn = volunteerAdd,
					title = '已添加'
				if (!status) {
					fn = volunteerDel,
						title = '已取消'
				}
				fn({
					majorCategoryId: item.majorCategoryId,
					majorScoreId: item.majorScoreId,
					schoolId: this.schoolInfo.schoolId,
					batchName: this.batchName,
					examAnalysisId: item.examAnalysisId,
				}).then(res => {
					this.majorList.list[index].isVolunteer = status
					// this.majorList.list = list
					uni.showToast({
						title,
						icon: 'none',
						duration: 2000
					})
				})
			},
			gotoSchool() {
				let id = this.schoolInfo.schoolId
				this.$pageTo('/bks/index/school/index/index', {
					id
				})
			},
			// 展示tips
			showTips() {
				uni.showModal({
					title: '提示',
					content: '数据来源于院校相关年限的招生计划与分数，且这些数据都来源于网络收集，备考生基于这些数据与成绩大数据进行智能分析，数据与分析结果仅供参考，本页数据仅是志愿的模拟，真实志愿请以考试院填报为准，感谢您的关注。',
					confirmColor: '#00C15D',
					showCancel: false,
					success(res) {}
				})
			},
			// 跳转模拟志愿
			goto() {
				this.$pageTo('/bks/volunteer/mockVolunteer/index')
			},
		}
	}
</script>

<style lang="scss" scoped>
	.tags .item {
		padding: 0 16rpx;
		background: #F5F5FA;
		border-radius: 3px;
		height: 36rpx;
		line-height: 36rpx;
		color: #9899A1;
		margin-top: 6rpx;
		margin-right: 12rpx;
	}

	.container .btn-group {
		position: fixed;
		bottom: 98rpx;
		right: 23rpx;
	}

	.container .btn-group .btn {
		width: 88rpx;
		height: 88rpx;
		line-height: 88rpx;
		text-align: center;
		background: linear-gradient(-45deg, #FAA40F 0%, #FFCE7A 100%);
		box-shadow: 0px 0px 10rpx 0px rgba(0, 8, 16, 0.1);
		border-radius: 50%;
		margin-top: 30rpx;
	}

	.academyinfo {
		height: 360rpx;
		padding: 40rpx 30rpx;
	}

	.academyinfo .top image {
		width: 28rpx;
		height: 32rpx;
		margin-left: 7rpx;
	}

	.academyinfo .middle {
		padding: 20rpx 0 30rpx;
		border-bottom: 1px solid #F0F0F5;
	}

	.academyinfo .middle image {
		width: 96rpx;
		height: 96rpx;
		border-radius: 50%;
		margin-right: 25rpx;
	}

	.academyinfo .bottom {
		padding-top: 30rpx;
		text-align: center;
	}

	.list .item .content-box {
		padding: 40rpx 30rpx;

	}

	.list .item .content-box .top {
		padding-bottom: 30rpx;
		border-bottom: 1px solid #F0F0F5;
	}

	.list .item .content-box .top .right .btn {
		padding: 0;
		width: 118rpx;
		height: 52rpx;
		line-height: 52rpx;
		text-align: center;
		border-radius: 6rpx;
		font-size: 24rpx;
		background: #fff;
		border: 1px solid #C7C8D4;
	}

	.list .item .content-box .top .right .uncheckbtn {
		border: 1px solid #00C15D;
		color: #00C15D;
	}

	.list .item .content-box .bottom {
		padding-top: 30rpx;
		text-align: center;
	}
</style>